<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:th="http://www.thymeleaf.org"
	xmlns:winter="http://www.winter.org"
	xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout"
	layout:decorator="/layouts/layout">
<head>
	<title>Datos Complementarios</title>
</head>
<body>
	<section layout:fragment="content">
		<winter:output id="DatosCOutput">
			<form id="DatosCForm" th:object="${datosComp}" class="form">
				<div id="BarraDatos" class="headerbar" th:if="${datosComp.context.lista}">
					<div class="form-title" th:text="@{'Datos Complementarios'}">Datos Complementarios</div>
						<winter:ajaxsubmit 
							id="@{'AgregarDatoC'}" 
							form="DatosCForm"
							url="@{'/datosComp/agregarDato'}" 
							update="DatosCOutput"
							value="Agregar Dato Comp"
							object="datosComp"
							effect="fade"
							showstatus="true"
							class="btn btn-cyan"
							immediate="true">
						</winter:ajaxsubmit>
				</div>			
				<div th:text="#{mensaje.datosComp.vacio}" class="info-message" th:if="${!datosComp.context.datoComp and #lists.isEmpty(datosComp.datos)}">
				</div>
				<winter:output id="TablaDatosC">
					<winter:datatable 
						id="ListaDatosC"
						customLanguage="true"
						paginate="true"
						jQuery="true"
						retrieve="true"
						emptyTableText="No se encontraron Datos!"
						infoText="Mostrando _START_ al _END_ de _TOTAL_ registros"
						emptyTableInfoText="Mostrando 0 al 0 de 0 registros"
						searchText="Buscar"
						lengthMenu="Mostrar _MENU_ registros"
						if="${datosComp.context.lista and !#lists.isEmpty(datosComp.datos)}">
						<thead>
							<tr>
							    <th th:text="@{'Codigo'}"></th>
							    <th th:text="@{'Descripcion'}"></th>
							    <th th:text="@{'Tipo Dato'}"></th>
							    <th th:text="@{'Longitud'}"></th>
							    <th th:text="@{'Precision'}"></th>
							    <th th:text="@{'Mascara'}"></th>
							    <th th:text="@{'Lista de Valores'}"></th>
							    <th th:text="@{'Activo'}"></th>
								<th th:text="@{'Operaciones'}"></th>
							</tr>
						</thead>
						<tbody>
							<tr th:each="datoItem, rowStat : ${datosComp.datos}" style="line-height: 2em;">
								<td th:text="${datoItem.codigo}" class="align-center"></td>
								<td th:text="${datoItem.descripcion}" class="align-center"></td>
								<td th:text="${datoItem.tipoDato.descripcion}" class="align-center"></td>
								<td th:text="${datoItem.longitud}" class="align-center"></td>
								<td th:text="${datoItem.precisiondato}" class="align-center"></td>
								<td th:text="${datoItem.mascara}" class="align-center"></td>
								<td th:text="${datosComp.descEstado(datoItem.usaListaDeValores)}" class="align-center"></td>
								<td th:text="${datosComp.descEstado(datoItem.activo)}" class="align-center"></td>
								<td class="tabla-operaciones">
									<div class="button-toolbar">
										<winter:ajaxlink 
											id="@{${rowStat.index}+'EditarDatoComp'}" 
											form="DatosCForm"
											url="@{'/datosComp/editarDatoComp/'+${rowStat.index}}" 
											update="DatosCOutput"
											title="Editar"
											tip="true"
											object="datosComp"
											effect="fade"
											showstatus="true"
											immediate="true"
											class="ajax-submit icon-edit-sign icon-2x">
										</winter:ajaxlink>
										<winter:ajaxlink 
											id="@{${rowStat.index}+'EliminarDatoComp'}" 
											form="DatosCForm"
											url="@{'/datosComp/deleteDatoComp/'+${rowStat.index}}" 
											update="DatosCOutput"
											title="Eliminar"
											tip="true"
											object="datosComp"
											effect="fade"
											showstatus="true"
											immediate="true"
											class="ajax-submit icon-remove-sign icon-2x"
											confirmationrequired="true"
							                confirmationtext="Está seguro que desea realizar la operación?">
										</winter:ajaxlink>
									</div>
								</td>
							</tr>
						</tbody>
					</winter:datatable>
				</winter:output>
				<div th:if="${datosComp.context.datoComp}" class="regla">
					<div id="CrearEditarDatoComp" th:include="/admin/datoComp :: datoComp">
	  				</div>
				</div>			
			</form>
		</winter:output>
	</section>
</body>
</html>